<template>
  <div>
    <el-table
      stripe
      border
      :data="this.goodsData"
      style="width: 100%;margin-top: 10px"
      @selection-change="handlerSelectionChange"
      ref ="goodsTable"
    >
      <el-table-column
        type="selection"
        width="55">
      </el-table-column>
      <el-table-column
        label="序号" width="50px">
        <template v-slot="scope">
          <span>{{(pageParams.pageNum - 1) * pageParams.pageSize + scope.$index + 1}}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="goodsid"
        label="商品id">
      </el-table-column>
      <el-table-column
        prop="userid"
        label="供货商id">
      </el-table-column>
      <el-table-column
        prop="warehouseid"
        label="仓库id">
      </el-table-column>
      <el-table-column
        prop="kind"
        label="商品种类">
      </el-table-column>
      <el-table-column
        prop="name"
        label="商品名称">
      </el-table-column>
      <el-table-column
        prop="storage"
        label="商品库存">
      </el-table-column>
      <el-table-column
        prop="info"
        label="商品信息">
      </el-table-column>
      <el-table-column
        prop="price"
        label="商品单价">
      </el-table-column>
      <el-table-column
        prop="status"
        label="商品状态"
        :filters="[{ text: '入仓已上架', value: '入仓已上架' }, { text: '入仓未上架', value: '入仓未上架' },
      { text: '未入仓', value: '未入仓' }]"
        :filter-method="filterTag">
        <template v-slot="scope">
          <el-tag
            :type="scope.row.status === '未入仓' ? 'warning': scope.row.status === '入仓已上架'?'success':'primary'"
            disable-transitions>
            {{ scope.row.status}}
          </el-tag>
        </template>
      </el-table-column>
    </el-table>
    <div class="pagination" style="margin-top:20px;text-align:center;">
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        layout="total,prev, sizes, pager, next,jumper"
        :current-page.sync="pageParams.pageNum"
        :page-size="pageParams.pageSize"
        :page-sizes="[10,20,50,100]"
        :total="goodsData.length">
      </el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  name: "adminGoods",
  data(){
    return{
      selectItems:[],
      //user: JSON.parse(window.sessionStorage.getItem("user"))
      goodsData: [
        {
          goodsid: '商品id',
          warehouseid: '仓库id',
          userid: '供货商id',
          storage:100,
          name:'商品名称',
          info:[],
          kind:'火锅',
          price:'商品单价',
          status:'入仓未上架'
        },
        {
          goodsid: '商品id',
          warehouseid: '仓库id',
          userid: '供货商id',
          storage:200,
          name:'商品名称',
          info:[],
          kind:'火锅',
          price:'商品单价',
          status:'入仓已上架'
        },
        {
          goodsid: '商品id',
          warehouseid: '仓库id',
          userid: '供货商id',
          storage:0,
          name:'商品名称',
          info:[],
          kind:'火锅',
          price:'商品单价',
          status:'未入仓'
        }
      ],
      pageParams: {
        selectItems:[],
        goodsData: [],
        pageNum: 1,
        pageSize: 10
      }
    }
  },

  methods:{
    initGoodsData(){
      this.getRequest('/获取供货商下所有未入仓和已入仓的商品',user.id).then(res=>{
        if(res)
        {
          //this.warehouse = res
        }
      })
    },
    filterTag(value, row) {
      return row.status === value;
    },
    handlerSelectionChange(val) {
      this.selectItems = val;
    },
    handleSizeChange(val) {
      this.pageParams.pageNum = 1;
      this.pageParams.pageSize = val;
    },

    handleCurrentChange(val) {
      this.pageParams.pageNum = val;
    }
  }
}
</script>

<style scoped>

</style>
